<script lang="ts" setup>
    import {HomeFilled,Sunrise,Avatar} from '@element-plus/icons-vue'
    import {computed,ref,onMounted} from 'vue'
    import {getCurrentDate} from '@/utils/UtilFn'
    import { useEarthStore } from "../stores/earthObj";
    import { useEarthGroup } from '@/utils/GV_DrawFn/EarthViewerGroup';
    import {useDrawGraphical} from '@/utils/GV_DrawFn/DrawGraphical'
    const store = useEarthStore();

    let SystemName = ref(window['GVConfig'].SystemName)
    
    onMounted(()=>{
        initialDrawMain()
    })

    let viewer = null;
    // 初始化绘制主体函数
    const initialDrawMain = ()=>{
        let viewer = store.getViewer();
        if(!viewer){
            setTimeout(initialDrawMain,1000)
            return;
        }
        viewer = store.getViewer()
        let group = new useEarthGroup(viewer)
        let draw = new useDrawGraphical(group,viewer);
        
    }

    let time = ref('00:00:00');

    const getDate = ()=>{
        time.value = getCurrentDate()
    }
    setInterval(getDate,1000)



</script>
<template>
    <div class="HomeHeader">
        <div class="Header_time">
            时间：<span>{{ time }}</span>
        </div>
        <div class="Header_title">
            {{ SystemName }}
        </div>
        <div class="Header_home">
            <div class="homeBtn">
                <el-icon><Sunrise /></el-icon>
                <slot name="HeadBtnIcon"></slot>
                <el-icon><Avatar /></el-icon>
            </div>
        </div>
    </div>
</template>
<style scoped>
    .HomeHeader{
        width: 90%;
        margin: auto;
        height: 100%;
        display: flex;
        color: #fff;
        align-items: center;
        justify-content: center;
    }
    .Header_time{
        flex: 1;
    }
    .Header_title{
        flex: 3;
        font-size: 28px;
        text-align: center;
    }
    .Header_home{
        flex: 1;
    }
    .homeBtn{
        margin-top: 11px;
        text-align: right;
    }
    .homeBtn i{
        cursor: pointer;
        margin: 0 7px;
        font-size: 18px;
    }
</style>